<template>
  <DIV class="bg_write" v-loading="loading" style="height: auto">
    <el-row>
      <el-col :span="24" class="content_title clearfix">
        <el-col :span="12">
          <HeadTitle></HeadTitle>
        </el-col>
        <el-col :span="12"> </el-col>
      </el-col>
    </el-row>

    <el-row></el-row>
    <div class="content_edit">
      <div class="black">
        <h5>基本信息</h5>
        <div class="add_con_form info">
          <ul style>
            <li>
              <span>订单ID：</span>
              {{ this.base.id }}
            </li>
            <li>
              <span>订单号：</span>
              {{ this.base.oid }}
            </li>
            <li>
              <span>订单类型：</span>
              {{ this.base.types_cn }}
            </li>
            <li>
              <span>下单时间：</span>
              {{ this.base.created_time | getTimeFormat }}
            </li>
            <li>
              <span>订单金额：</span>
              {{ $fnc.toFixedZ(base.money) }}
            </li>
            <li>
              <span>下单会员：</span>
              {{ this.base.uid_cn }}
            </li>
            <li>
              <span>收货人：</span>
              {{ this.base.mail_name }}
              <span @click="showEditMailDialog()">(修改)</span>
            </li>
            <li>
              <span>联系电话：</span>
              {{ this.base.mail_tel }}
              <span @click="showEditMailDialog()">(修改)</span>
            </li>
            <li>
              <span>收货地址：</span>

              <!-- <span style="width:70%;"> -->
              {{ $fnc.deleteNumber(this.base.mail_province + this.base.mail_city + this.base.mail_area + this.base.mail_town) }}{{ this.base.mail_address }}
              <!-- </span> -->
              <span @click="showEditMailDialog()">(修改)</span>
            </li>
            <li>
              <span>物流方式：</span>
              {{ this.base.mail_courier }}
            </li>
            <li>
              <span>发货单号：</span>
              {{ this.base.mail_oid }}
            </li>
            <li>
              <span>支付时间：</span>
              <span v-if="base.pay_time != 0">{{ this.base.pay_time | getTimeFormat }}</span>
            </li>
            <li v-if="base.mail_time != 0">
              <span>{{ base.types == 40 ? "接单" : "发货" }}时间：</span>
              <span>{{ this.base.mail_time | getTimeFormat }}</span>
            </li>
            <li v-if="base.complete_time != 0">
              <span>完成时间：</span>
              <span>{{ this.base.complete_time | getTimeFormat }}</span>
            </li>
            <li>
              <span>是否积分抵用：</span>
              {{ base.is_integral == 0 ? "否" : "是" }}
            </li>
            <li>
              <span>是否优惠卷抵用：</span>
              {{ base.is_red == 0 ? "否" : "是" }}
            </li>
            <li>
              <span>是否已评价：</span>
              {{ base.is_review == 0 ? "否" : "是" }}
            </li>
            <li>
              <span>是否虚拟产品订单：</span>
              {{ base.is_virtual == 0 ? "否" : "是" }}
            </li>
            <li>
              <span>是否开具发票：</span>
              {{ base.is_invoice == 0 ? "否" : "是" }}
            </li>
            <li>
              <span>是否结算：</span>
              {{ base.is_settle == 0 ? "否" : "是" }}
            </li>
            <li>
              <span>结算时间：</span>
              {{ base.settle_time | getTimeFormat }}
            </li>
            <li>
              <span>订单类型：</span>
              {{ this.base.types_cn }}
            </li>
            <li>
              <span>支付状态：</span>
              {{ base.is_pay == 0 ? "未支付" : "已支付" }}
            </li>
            <li v-if="(base.status == '已支付' && base.types == 14) || (base.status == '已发货' && base.types == 13)">
              <span>交易状态：</span>
              已预约
            </li>
            <li v-else-if="base.status == '已发货' && base.types == 14">
              <span>交易状态：</span>
              已服务
            </li>
            <li v-else>
              <span>交易状态：</span>
              {{ base.status }}
            </li>
            <li v-if="base.sid > 0">
              <span>店铺名称：</span>
              {{ base.sid_cn }}
            </li>
            <li v-if="base.write_code">
              <span>核销码：</span>
              {{ base.write_code }}
            </li>
            <li v-if="base.name">
              <span>预约人姓名：</span>
              {{ base.name }}
            </li>
            <li v-if="base.id_card_no">
              <span>预约人身份证号：</span>
              {{ base.id_card_no}}
            </li>
            <li v-if="base.reserve_time">
              <span>预约时间：</span>
              {{ base.reserve_time | getTimeFormat }}
            </li>
            <li v-if="base.adult_num">
              <span>预约大人数：</span>
              {{ base.adult_num}}
            </li>
            <li v-if="base.baby_num">
              <span>预约儿童数：</span>
              {{ base.baby_num}}
            </li>
            <li v-if="base.address">
              <span>门票地址：</span>
              {{ base.address}}
            </li>
            <li v-if="base.contact_name">
              <span>联系人：</span>
              {{ base.contact_name}}
            </li>
            <li v-if="base.contact_mobile">
              <span>联系人电话：</span>
              {{ base.contact_mobile}}
            </li>

            <template v-if="base.rider_extract_ar && base.rider_extract_ar.id">
              <li>
                <span>门店标题：</span>
                {{ base.rider_extract_ar.title }}
              </li>
              <li>
                <span>门店电话：</span>
                {{ base.rider_extract_ar.tel }}
              </li>
              <li>
                <span>门店地址：</span>
                {{ base.rider_extract_ar.province }}
                {{ base.rider_extract_ar.city }}
                {{ base.rider_extract_ar.area }}
                {{ base.rider_extract_ar.town }}
                {{ base.rider_extract_ar.add }}
              </li>
            </template>

            <li v-if="base.rider_uid > 0">
              <span>骑手：</span>
              {{ base.rider_uid_nick }}({{ base.rider_uid_cn }})
            </li>
            <li style="width: 100%" v-if="base.status != '未支付' && base.remarks && base.remarks != ''">
              <span>用户下单备注：</span>
              {{ base.remarks }}
            </li>
            <li style="width: 100%" v-if="base.remark ">
              <span>管理员备注：</span>
              {{ base.remark }}
            </li>
            <li style="width: 100%" v-if="base.admin_remark ">
              <span>管理员备注：</span>
              {{ base.admin_remark }}
            </li>
            <li v-if="base.types == 25">
              <span>礼品卡面值：</span>
              ¥{{ base.recharge_card_money | keepTwoNum }}
            </li>
            <li v-if="base.types == 25">
              <span>卡号：</span>
              <span id="card_code">{{ base.recharge_card_code }}</span>
              <i class="el-icon-document-copy" style="font-size: 18px; padding-left: 10px" @click="copy_gift('card_code')"></i>
            </li>
            <li v-if="base.types == 25">
              <span>密码：</span>
              <span id="card_password">{{ base.recharge_card_password }}</span>
              <i class="el-icon-document-copy" style="font-size: 18px; padding-left: 10px" @click="copy_gift('card_password')"></i>
            </li>
            <li v-if="base.types == 25">
              <span>使用状态：</span>
              {{ base.recharge_card_status == "0" ? "未使用" : "已使用" }}
            </li>
          </ul>
          <div class="blank"></div>
        </div>
      </div>
    </div>
    <div class="blank"></div>

    <div class="content_edit" v-if="base.types == 55">
      <div class="black">
        <h5>跑腿信息</h5>
        <div class="add_con_form info">
          <ul style>
            <li>
              <span>订单状态：</span>
              {{base.run_types == 1 ?'跑腿 帮我送' : base.run_types == 2 ?'跑腿 帮我取' : base.run_types == 3 ?'跑腿 帮我买' :'跑腿信息'}}
            </li>
            <li v-if="base.run_time > 0">
              <span>预约时间：</span>
              {{base.run_time | getTimeFormat }}
            </li>
            <li>
              <span>收货码：</span>
              {{base.is_run_check == 1 ?'需要':'不需要'}}
            </li>
            <li v-if="base.run_class && base.run_weight">
              <span>物品重量：</span>
              {{base.run_class}} &nbsp{{ Number(base.run_weight) }}公斤
            </li>
            <li v-if="base.run_value > 0">
              <span>物品实际价值(保价)：</span>
              {{ Number(base.run_value) }}
            </li>
            <li v-if="base.run_predict_money > 0">
              <span>预估商品费：</span>
              {{ Number(base.run_predict_money) }}
            </li>
            <li style="width:100%" v-if="base.run_remarks">
              <span>{{base.run_types == 3 ? '购买':''}}备注：</span>
              {{ base.run_remarks}}
            </li>
            <li style="width:100%" v-if="base.run_img && JSON.parse(base.run_img || '[]') && JSON.parse(base.run_img || '[]').length > 0">
              <span>{{base.run_types == 3 ? '购买':''}}备注图片：</span>
              <el-image style="width: 30px; height: 30px;margin-right:10px" :src="url" :preview-src-list="JSON.parse(base.run_img || '[]')" v-for="(url,i) in JSON.parse(base.run_img || '[]')" :key="i">
              </el-image>
            </li>

            <li style="width:100%">
              <span>取货联系人：</span>
              {{ `${base.mail_name || ""} / ${base.mail_tel || ""}`}}
            </li>
            <li style="width:100%">
              <span>取货地址：</span>
              {{ `${base.mail_province || ""}${base.mail_city || ""}${base.mail_area || ""}${base.mail_town || ""}${base.mail_address}` }}
            </li>

            <li v-if="base.run_types == 1 || base.run_types == 2" style="width:100%">
              <span>收货联系人：</span>
              {{ `${base.mail_name2 || ""} / ${base.mail_tel2 || ""}`}}
            </li>
            <li v-if="base.run_types == 1 || base.run_types == 2" style="width:100%">
              <span>收货地址：</span>
              {{ `${base.mail_province2 || ""}${base.mail_city2 || ""}${base.mail_area2 || ""}${base.mail_town2 || ""}${base.mail_address2}` }}
            </li>
            <li v-if="base.run_types == 3 && base.mail_address3" style="width:100%">
              <span>购买地址：</span>
              {{ `${base.mail_province3 || ""}${base.mail_city3 || ""}${base.mail_area3 || ""}${base.mail_town3 || ""}${base.mail_address3}` }}
            </li>
            <li v-if="base.run_types == 3 && base.mail_address3" style="width:100%">
              <span>购买地址：</span>就近购买
            </li>

            <li v-if="base.run_distribution >0 ">
              <span>基础配送费：</span>¥{{Number(base.run_distribution)}}
            </li>
            <li v-if="base.run_distribution >0 ">
              <span>距离附加费：</span>¥{{Number(base.run_distance_price)}}
            </li>
            <li v-if="base.run_weight_price >0 ">
              <span>重量附加费：</span>¥{{Number(base.run_weight_price)}}
            </li>
            <li v-if="base.run_time_price >0 ">
              <span>特殊时间费用：</span>¥{{Number(base.run_time_price)}}
            </li>
            <li v-if="base.run_bao_price >0 ">
              <span>保价费：</span>¥{{Number(base.run_bao_price)}}
            </li>
            <li v-if="base.add_money >0">
              <span>小费：</span>¥{{Number(base.add_money)}}
            </li>

          </ul>
          <div class="blank"></div>
        </div>
      </div>

    </div>
    <div class="content_edit" v-if="base.types == 39">
      <div class="black">
        <h5>接单信息</h5>
        <div class="add_con_form info">
          <ul style>
            <li>
              <span>订单状态：</span>
              {{ base.status }}
            </li>
            <li>
              <span>订单佣金：</span>
              {{ base.receiving_money ? $fnc.toFixedZ(base.receiving_money) : "未知" }}
            </li>
            <li>
              <span>核销码：</span>
              {{ base.receiving_code || "" }}
            </li>
            <li>
              <span>下单用户：</span>
              {{ base.mail_name || "" }}
            </li>
            <li>
              <span>下单电话：</span>
              {{ base.mail_tel || "" }}
            </li>
            <li>
              <span>服务地址：</span>
              {{ `${base.mail_province || ""}${base.mail_city || ""}${base.mail_area || ""}${base.mail_town || ""}${base.mail_address}` }}
            </li>
            <li>
              <span>下单预约时间：</span>
              {{ base.receiving_time | getTimeFormat }} ~ {{ (Number(base.receiving_time) + 3600) | getTimeFormat5 }}
            </li>
            <li>
              <span>下单留言：</span>
              {{ base.receiving_remark || "无留言信息" }}
            </li>

            <li @click="lookImg('receiving_piclink', base)">
              <span>下单图片：</span>
              <span class="hover_a">查看</span>
            </li>
            <li>
              <span>下单时间：</span>
              {{ base.pay_time | getTimeFormat }}
            </li>
            <li>
              <span>接单时间：</span>
              {{ base.mail_time | getTimeFormat }}
            </li>
            <li style="width: 100%; height: 0.5px; margin: 0"></li>
            <li>
              <span>开始时间：</span>
              {{ base.receiving_open_time | getTimeFormat }}
            </li>
            <li @click="lookImg('receiving_open_piclink', base)">
              <span>开始图片：</span>
              <span class="hover_a">查看</span>
            </li>
            <li style="width: 100%; height: 0.5px; margin: 0"></li>
            <li>
              <span>完成时间：</span>
              {{ base.complete_time | getTimeFormat }}
            </li>
            <li @click="lookImg('receiving_complete_piclink', base)">
              <span>完成图片：</span>
              <span class="hover_a">查看</span>
            </li>
            <template v-if="receiving_ar && receiving_ar.id">
              <!-- 接单师傅信息 -->
              <li style="display: flex; align-items: center">
                <span>接单师傅：</span>
                <div style="display: flex; justify-content: flex-start; align-items: center">
                  <img :src="$fnc.getImgUrl(receiving_ar.avatar)" alt="" style="width: 30px; height: 30px; border-radius: 50%; margin-right: 10px" />
                  <span>{{ receiving_ar.name }}</span>
                </div>
              </li>
              <li>
                <span>师傅电话：</span>
                {{ receiving_ar.tel }}
              </li>
            </template>
            <template v-if="base && base.status == '已取消'">
              <!-- 申请取消 -->
              <li style="width: 100%; height: 0.5px; margin: 0"></li>
              <li>
                <span>取消时间：</span>
                {{ base.return_time | getTimeFormat }}
              </li>
              <li>
                <span>取消原因：</span>
                {{ base.admin_remark || "---" }}
              </li>
              <li>
                <span>退款金额：</span>
                {{ base.return_order ? $fnc.toFixedZ(base.return_order) : "未知" }}
              </li>
            </template>

            <template v-if="base && base.receiving_suspend_time > 0">
              <!-- 申请挂起 -->
              <li style="width: 100%; height: 0.5px; margin: 0"></li>
              <li>
                <span>挂起时间：</span>
                {{ base.receiving_suspend_time | getTimeFormat }}
              </li>
              <li>
                <span>挂起原因：</span>
                {{ base.receiving_suspend || "---" }}
              </li>
            </template>
            <!-- 服务信息 -->
            <!-- 订单留言图片 -->
            <!-- 服务前图片 -->
            <!-- 服务完成图片 -->
          </ul>
          <div class="blank"></div>
        </div>
      </div>
      <el-row>
        <el-col :span="24" class="pd_20">
          <el-table ref="multipleTable" :data="receiving_service_ar" border tooltip-effect="dark" style="width: 99.8%">
            <el-table-column label="售后说明" min-width="50">
              <template slot-scope="scope">{{ scope.row.receiving_remark }}</template>
            </el-table-column>
            <el-table-column label="预约时间" min-width="50">
              <template slot-scope="scope">{{ scope.row.receiving_time | getTimeFormat }}</template>
            </el-table-column>

            <el-table-column label="当前状态" min-width="50">
              <template slot-scope="scope">
                <div>
                  {{ scope.row.status == 0 ? "申请中" : scope.row.status == 1 ? "完成" : scope.row.status == 2 ? "用户取消" : scope.row.status == 3 ? "师傅取消" : "" }}
                </div>
                <div>备注:{{ scope.row.status == 2 ? "用户" : scope.row.status == 3 ? "师傅" : "" }}取消备注：{{ scope.row.remark || "暂无备注" }}</div>
              </template>
            </el-table-column>

            <el-table-column label="用户申请售后图片" min-width="50">
              <template slot-scope="scope">
                <span class="hover_a" @click="lookImg('receiving_service', scope.row)">查看</span>
              </template>
            </el-table-column>
            <el-table-column label="师傅提交售后图片" min-width="50">
              <template slot-scope="scope">
                <span class="hover_a" @click="lookImg('receiving_service', scope.row)">查看</span>
              </template>
            </el-table-column>
            <el-table-column label="创建时间" min-width="50">
              <template slot-scope="scope">{{ scope.row.created_time | getTimeFormat }}</template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24" class="pd_20">
          <!-- 增项服务 -->
          <el-table ref="multipleTable" :data="receiving_additions_ar" border tooltip-effect="dark" style="width: 99.8%">
            <el-table-column label="增项服务" min-width="50">
              <template slot-scope="scope">{{ scope.row.title }}</template>
            </el-table-column>
            <el-table-column label="增项订单号" min-width="50">
              <template slot-scope="scope">{{ scope.row.oid }}</template>
            </el-table-column>
            <el-table-column label="增项金额" min-width="50">
              <template slot-scope="scope">{{ scope.row.money | keepTwoNum }}</template>
            </el-table-column>

            <el-table-column label="支付状态" min-width="50">
              <template slot-scope="scope">
                <div>
                  {{ scope.row.is_pay == 1 ? "已支付" : "未支付" }}
                </div>
                <div v-if="scope.row.is_pay == 1">支付方式：{{ scope.row.pay }}</div>
                <div v-if="scope.row.is_pay == 1">支付时间：{{ scope.row.pay_time | getTimeFormat }}</div>
              </template>
            </el-table-column>

            <el-table-column label="创建时间" min-width="50">
              <template slot-scope="scope">{{ scope.row.created_time | getTimeFormat }}</template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </div>
    <div class="black">
      <p style="font-size: 22px; font-weight: bold">订单详情</p>
      <el-row>
        <el-col :span="24" class="pd_20">
          <el-table ref="multipleTable" :data="product_ar" border tooltip-effect="dark" style="width: 99.8%" :span-method="objectSpanMethod">
            <el-table-column label min-width="60">
              <template slot-scope="scope">
                <router-link :to="'/index/shop/addproduct?id=' + scope.row.pid" target="_blank">
                  <img style="width: 100px; margin: 0 auto" :src="$fnc.getImgUrl(scope.row.piclink)" class="image" />
                </router-link>
              </template>
            </el-table-column>

            <el-table-column label="商品名称" min-width="240">
              <template slot-scope="scope">
                <router-link :to="'/index/shop/addproduct?id=' + scope.row.pid" target="_blank">
                  {{ scope.row.title }}
                  <br />
                  <span v-for="(vo, index) in scope.row.sku_cn" :key="index">{{ vo }} &nbsp;&nbsp;&nbsp;&nbsp;</span>
                </router-link>
              </template>
            </el-table-column>

            <el-table-column label="价格" min-width="50">
              <template slot-scope="scope">￥{{ scope.row.price | keepTwoNum }}</template>
            </el-table-column>

            <el-table-column label="数量" min-width="50">
              <template slot-scope="scope">{{ scope.row.number }}</template>
            </el-table-column>

            <el-table-column label="价格小计" min-width="50">
              <template slot-scope="scope">￥{{ scope.row.money | keepTwoNum }}</template>
            </el-table-column>
            <el-table-column label="旅游劵抵扣" min-width="50">
              <template slot-scope="scope">
                <p v-if="scope.row.is_integral == '1'">使用{{ scope.row.integral_dk_per | keepTwoNum }}抵用{{ scope.row.integral_dk_money | keepTwoNum }}元</p>
                <p v-else>无</p>
              </template>
            </el-table-column>

            <el-table-column label="优惠活动" min-width="50">
              <template slot-scope="scope">
                <p v-if="scope.row.is_red == '1'">优惠卷抵用{{ scope.row.integral_dk_money | keepTwoNum }}</p>
                <p v-else>无</p>
              </template>
            </el-table-column>
          </el-table>
          <div class="tl count pd_20">
            <b>
              订单成本：¥{{ base.cost | keepTwoNum }} 元
              <br />
              奖励佣金值：{{ base.reward | keepTwoNum }} 元
              <br />
              商品总价： ¥{{ base.sum_price | keepTwoNum }} 元
              <br />
              <span v-if="base.mail_money == 0">物流运费：免运费</span>
              <span v-else>物流运费： ¥{{ base.sum_mail | keepTwoNum }}元</span>
              <br />
              实付总价：￥{{ this.base.money | keepTwoNum }}元
              <br />
              <span v-if="this.base.reserve_time && this.base.reserve_time != '' && this.base.reserve_time != '0'">
                预约时间：{{ this.base.reserve_time | getTimeFormat }}
                <br />
              </span>

              <span v-if="this.base.tour_day && this.base.tour_day != '' && this.base.tour_day != '0'">
                出行日期：{{ this.base.tour_day }}
                <br />
              </span>
              <span v-if="JSON.stringify(store) != '[]'">
                服务门店：{{ store.title }}
                <br />
                门店信息：{{ store.name }}&nbsp;&nbsp;&nbsp;{{ store.tel }}
                <br />
                门店地址：{{ $fnc.deleteNumber(store.province + store.city + store.area + store.town) }}{{ store.address }}
                <br />
              </span>
              <span v-if="base.gb_types > 0">
                参与拼团方式：{{ base.gb_types == 1 ? "自定义次数" : "拼中为止" }}
                <br />
                <span v-if="base.gb_types == 1">
                  参与拼团次数：{{ base.gb_num }}
                  <br />
                </span>
              </span>
            </b>
            <div v-if="base.pay == '虚拟币支付'">
              <el-col :span="3">
                <b>虚拟币价格：</b>
                <span>{{ base.coin_price }}</span>
              </el-col>
              <el-col :span="3">
                <b>虚拟币金额：</b>
                <span>{{ base.coin_money }}</span>
              </el-col>
            </div>
            <div v-if="base.types == 6">
              <el-col :span="3">
                <b>定金价格：</b>
                <span>{{ base.down_pay | keepTwoNum }}元</span>
              </el-col>
              <el-col :span="3">
                <b>货品尾款：</b>
                <span>{{ Number(base.second_pay) > 0 ? Number(base.second_pay) : 0 }}</span>
              </el-col>
              <el-col :span="6">
                <b>支付尾款日期：</b>
                <span>{{ base.delivery_date | getTimeFormat }}</span>
              </el-col>
            </div>

            <div v-if="base.types == 4">
              <el-row>
                <el-col :span="3">
                  <b>拼团状态：</b>
                  <el-tag type="info" v-if="base.groups.status == 0" effect="dark">拼团进行中</el-tag>
                  <el-tag type="success" v-else-if="base.groups.status == 1" effect="dark">拼团成功</el-tag>
                  <el-tag type="danger" v-else effect="dark">拼团失败</el-tag>
                </el-col>
                <el-col :span="3">
                  <b>拼团人数：</b>
                  <span>{{ base.groups.group_people }}人</span>
                </el-col>
                <el-col :span="3">
                  <b>已拼团人数：</b>
                  <span>{{ base.groups.now_people }}人</span>
                </el-col>
              </el-row>
              <el-row style="margin-top: 6px">
                <el-col :span="2" v-for="(item, i) in base.groups.lists" :key="i" class="tc">
                  <el-avatar :size="60" :src="item.avatar">
                    <img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png" />
                  </el-avatar>
                  <p>{{ item.nickname }}</p>
                </el-col>
              </el-row>
            </div>
            <div v-if="base.is_fixed == 1" class="fixed-info">
              <el-row>
                <el-col :span="3">
                  <b>固定分销：</b>
                  一级{{ base.fixed_level1 | keepTwoNum }}元
                </el-col>
                <el-col :span="2">
                  <span></span>
                  二级{{ base.fixed_level2 | keepTwoNum }}元
                </el-col>
                <el-col :span="3">
                  <span></span>
                  三级{{ base.fixed_level3 | keepTwoNum }}元
                </el-col>
              </el-row>
            </div>
            <div v-if="(base.types == 10 || base.types == 11) && base.status == '已完成' && base.write_code != ''">
              <el-col :span="3">
                <b>核销次数：</b>
                <span>{{ base.write_number }}</span>
              </el-col>
              <el-col :span="3">
                <b>已核销次数：</b>
                <span>{{ base.write_complete_number }}</span>
              </el-col>
              <b>核销码：</b>
              <small>{{ base.write_code }}</small>
              <el-tag effect="dark" type size="mini" color="#f56c6c" style="margin-left: 10px">
                <small id="tjm_btn" style="color: white; font-weight: normal; cursor: pointer" @click="copy_tjm($event)">点击复制</small>
              </el-tag>
            </div>

            <div v-if="base.is_lifting == 1 && lifting" class="fixed-info">
              <el-row>
                <el-col :span="1">
                  <b>自提</b>
                </el-col>
                <el-col :span="3">
                  <b>店铺名称:</b>
                  {{ lifting.title }}
                </el-col>
                <el-col :span="4">
                  <b>电话:</b>
                  {{ lifting.tel }}
                </el-col>
                <el-col :span="4">
                  <b>地址：</b>
                  {{ lifting.province + lifting.city + lifting.area + lifting.add }}
                </el-col>
              </el-row>
            </div>
          </div>
        </el-col>
      </el-row>

      <div class="blank"></div>
    </div>

    <div class="black">
      <el-row>
        <el-col :span="24" class="pd_20">
          <el-table ref="multipleTable" :data="moneylist" border tooltip-effect="dark" style="width: 99.8%">
            <el-table-column label="会员账号" min-width="50">
              <template slot-scope="scope">{{ scope.row.username }}</template>
            </el-table-column>

            <el-table-column label="会员昵称" min-width="50">
              <template slot-scope="scope">{{ scope.row.nickname }}</template>
            </el-table-column>

            <el-table-column label="订单号" min-width="50">
              <template slot-scope="scope">{{ scope.row.oid }}</template>
            </el-table-column>

            <el-table-column label="积分/现金" min-width="50">
              <template slot-scope="scope">
                {{ $fnc.toFixedZ(scope.row.money, 3) }}
                {{ scope.row.style_cn }}
              </template>
            </el-table-column>

            <el-table-column label="时间" min-width="50">
              <template slot-scope="scope">{{ scope.row.created_time | getTimeFormat }}</template>
            </el-table-column>

            <el-table-column label="剩余积分/现金" min-width="50">
              <template slot-scope="scope">
                {{ $fnc.toFixedZ(scope.row.balance, 3) }}
                {{ scope.row.style_cn }}
              </template>
            </el-table-column>

            <el-table-column label="交易类型" min-width="50">
              <template slot-scope="scope">{{ scope.row.style }}</template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </div>

    <!-- <div class="submit_button">
            <el-col :span="24" class="tc pd_20">
            <el-button  :loading='$store.state.isLoading' type="primary" @click.prevent="addUpdate()">提交</el-button>
            </el-col>
            <el-col :span="24" class="pd_20">&nbsp;</el-col>
    </div>-->
    <div class="black" v-if="base.types == 9 && people && people.length > 0" style="margin-top: 50px">
      <p style="font-size: 22px; font-weight: bold">出行人信息</p>
      <el-row>
        <el-col :span="24" class="pd_20">
          <el-table ref="multipleTable" :data="people" border tooltip-effect="dark" style="width: 99.8%">
            <el-table-column label="订单号" min-width="50">
              <template slot-scope="scope">{{ scope.row.oid }}</template>
            </el-table-column>
            <el-table-column label="姓名" min-width="50">
              <template slot-scope="scope">{{ scope.row.name }}</template>
            </el-table-column>
            <el-table-column label="手机号" min-width="50">
              <template slot-scope="scope">{{ scope.row.tel }}</template>
            </el-table-column>
            <el-table-column label="身份证" min-width="50">
              <template slot-scope="scope">
                {{ scope.row.sfz }}
                {{ scope.row.style_cn }}
              </template>
            </el-table-column>
            <el-table-column label="时间" min-width="50">
              <template slot-scope="scope">{{ scope.row.created_time | getTimeFormat }}</template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </div>
    <div class="black" v-if="base.types == 3 && people && people.length > 0" style="margin-top: 50px">
      <p style="font-size: 22px; font-weight: bold">砍价信息</p>
      <el-row>
        <el-col :span="24" class="pd_20">
          <el-table ref="multipleTable" :data="people" border tooltip-effect="dark" style="width: 99.8%">
            <el-table-column label="会员头像" min-width="20">
              <template slot-scope="scope">
                <img style="width: 50px; border-radius: 50%" :src="$fnc.getImgUrl(scope.row.avatar)" alt />
              </template>
            </el-table-column>
            <el-table-column label="会员帐号" min-width="40">
              <template slot-scope="scope">{{ scope.row.username || "" }}</template>
            </el-table-column>
            <el-table-column label="会员昵称" min-width="40">
              <template slot-scope="scope">{{ scope.row.nickname || "" }}</template>
            </el-table-column>
            <el-table-column label="砍价金额" min-width="50">
              <template slot-scope="scope">-{{ scope.row.money }}</template>
            </el-table-column>
            <el-table-column label="砍价时间" min-width="50">
              <template slot-scope="scope">{{ scope.row.update_time | getTimeFormat }}</template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </div>
    <div class="black" v-if="base.types == 19 && group_buy && group_buy.length > 0" style="margin-top: 50px">
      <p style="font-size: 22px; font-weight: bold; padding-bottom: 10px">拼购信息</p>
      <el-row>
        <el-col :span="24" class="pd_20">
          <el-table ref="multipleTable" :data="group_buy" border tooltip-effect="dark" style="width: 99.8%">
            <el-table-column label="拼购期数" min-width="40">
              <template slot-scope="scope">
                <router-link :to="'/index/groupbuy/phase?gid=' + scope.row.gid" target="_blank">
                  {{ scope.row.phase }}
                </router-link>
              </template>
            </el-table-column>
            <el-table-column label="开奖状态" min-width="40">
              <template slot-scope="scope">
                <router-link :to="'/index/groupbuy/phase?gid=' + scope.row.gid" target="_blank">
                  <el-tag v-if="scope.row.status == 0" effect="dark">未开奖</el-tag>
                  <el-tag type="danger" v-else effect="dark">已开奖</el-tag>
                </router-link>
              </template>
            </el-table-column>
            <el-table-column label="活动状态" min-width="40">
              <template slot-scope="scope">
                <router-link :to="'/index/groupbuy/phase?gid=' + scope.row.gid" target="_blank">
                  <el-tag v-if="scope.row.user_status == 0" effect="dark">拼购进行中</el-tag>
                  <el-tag type="success" v-else-if="scope.row.user_status == 1" effect="dark">拼购成功</el-tag>
                  <el-tag type="danger" v-else effect="dark">拼购失败</el-tag>
                </router-link>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </div>
    <el-dialog :close-on-click-modal="false" title="修改订单" :visible.sync="dialogVisible">
      <el-form :model="base" class="mar_top" label-width="100px">
        <el-form-item label="收货人">
          <el-col :span="4">
            <el-input placeholder v-model="base.mail_name" style="width: 400px" clearable></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="联系电话">
          <el-col :span="4">
            <el-input placeholder v-model="base.mail_tel" style="width: 400px" clearable></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="收货省市区">
          <el-col :span="13" style="width: 400px">
            <city-cascader size="large" :level="3" :placeholder="selectedOptions.join('-')" @change="handleChange" />
          </el-col>
        </el-form-item>

        <el-form-item label="收货地址">
          <el-col :span="4">
            <el-input placeholder v-model="base.mail_address" style="width: 400px" clearable></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="管理员备注">
          <el-col :span="4">
            <el-input type="textarea" placeholder v-model="base.admin_remark" style="width: 400px" clearable></el-input>
          </el-col>
        </el-form-item>

        <div class="mar_bottom_15">
          <el-button :loading="$store.state.isLoading" size="medium" type="primary" @click.prevent="subForm()">提交</el-button>
        </div>
      </el-form>
    </el-dialog>

    <el-dialog :close-on-click-modal="false" title="图片" class="tl size_13" width="800px" :visible.sync="show_image">
      <div class="detail_content" v-for="(item, i) in image_list" :key="i">
        <div class="detail_title">{{ item.title }}</div>
        <div class="detail_box">
          <el-image v-for="(piclink, p) in item.arr" :key="p" fit="cover" style="width: 100px; height: 100px; margin-right: 15px" :src="piclink" :preview-src-list="item.arr"> </el-image>
        </div>
        <div class="detail_box_text" v-if="item.arr && item.arr.length == 0">暂无图片</div>
      </div>
    </el-dialog>
  </DIV>
</template>
<script>
import HeadTitle from "@/components/currency/HeadTitle.vue";
import cityCascader from "@/components/currency/cityCascader/cityCascader";
export default {
  data() {
    return {
      image_list: [], //{title:'',arr:''}
      show_image: false,
      receiving_additions_ar: [],
      receiving_service_ar: [],
      receiving_ar: {},
      group_buy: [],
      people: [],
      options: this.$addressJson,
      selectedOptions: [],
      optionProps: {
        value: "y",
        label: "t",
        children: "z",
      },
      show: false,
      loading: false,
      dialogVisible: false,
      data: {
        province: "",
        city: "",
        area: "",
        town: "",
      },
      lifting: {},
      base: {
        id: "",
        oid: "",
        uid: "",
        uid_cn: "",
        sid: "",
        money: "",
        product_money: "",
        mail_money: "",
        pay: "",
        is_pay: "0",
        is_virtual: "0",
        status: "",
        integral_reach: "",
        integral_exchange: "",
        mail_name: "",
        mail_tel: "",
        mail_province: "",
        mail_city: "",
        mail_area: "",
        mail_town: "",
        mail_address: "",
        mail_courier: "",
        mail_id: "",
        mail_oid: "",
        mail_time: "",
        remark: "",
        admin_remark: "",
        created_time: "",
        pay_time: "",
        complete_time: "",
        update_time: "",
      },
      product_ar: [],
      moneylist: [],
      store: [],
    };
  },
  components: {
    HeadTitle,
    cityCascader,
  },
  methods: {
    toArr(val) {
      if (val) {
        return val.split("@");
      } else {
        return [];
      }
    },
    lookImg(iden, item) {
      let arr = [];
      if (iden == "receiving_service") {
        arr.push({
          title: "用户申请售后图片",
          arr: this.toArr(item.receiving_piclink),
        });
        arr.push({
          title: "师傅提交售后图片",
          arr: this.toArr(item.receiving_complete_piclink),
        });
      } else if (iden == "receiving_piclink") {
        arr.push({
          title: "下单图片",
          arr: this.toArr(item.receiving_piclink),
        });
      } else if (iden == "receiving_open_piclink") {
        arr.push({
          title: "开始图片",
          arr: this.toArr(item.receiving_open_piclink),
        });
      } else if (iden == "receiving_complete_piclink") {
        arr.push({
          title: "完成图片",
          arr: this.toArr(item.receiving_complete_piclink),
        });
      }
      console.log(arr);
      this.image_list = arr;
      this.show_image = true;
    },
    copy_gift(id) {
      var dom = document.getElementById(id);
      var span = dom.innerText;
      var oInput = document.createElement("input");
      oInput.value = span;
      document.body.appendChild(oInput);
      oInput.select();
      document.execCommand("Copy");
      oInput.className = "oInput";
      oInput.style.display = "none";
      this.$message.success("复制成功");
    },
    copy_tjm($event) {
      var dom = $event.currentTarget.parentElement.previousElementSibling;
      var span = dom.innerText;
      var oInput = document.createElement("input");
      oInput.value = span;
      document.body.appendChild(oInput);
      oInput.select();
      document.execCommand("Copy");
      oInput.className = "oInput";
      oInput.style.display = "none";
      this.$fnc.alertSuccess("复制成功");
    },
    // eslint-disable-next-line no-unused-vars
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      console.log(columnIndex, rowIndex);
      if (columnIndex === 5) {
        if (rowIndex % 2 === 0) {
          return {
            rowspan: 2,
            colspan: 1,
          };
        } else {
          return {
            rowspan: 0,
            colspan: 0,
          };
        }
      } else if (columnIndex === 6) {
        if (rowIndex % 2 === 0) {
          return {
            rowspan: 2,
            colspan: 1,
          };
        } else {
          return {
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
    imgError(item) {
      if (!item) {
        return require("../../assets/img/default_head.png");
      }
      if (item.indexOf("http") >= 0) {
        return item;
      } else {
        return "/api/" + item;
      }
    },
    handleChange(value) {
      console.log(value);
      if (value) {
        for (var i = 0; i < value.length; i++) {
          console.log(value[i]);
          if (i == 0) this.base.mail_province = value[i];
          if (i == 1) this.base.mail_city = value[i];
          if (i == 2) this.base.mail_area = value[i];
          if (i == 3) this.base.mail_town = value[i];
        }
      }
    },
    showEditMailDialog() {
      this.dialogVisible = true;
    },
    getmonsylist(oid) {
      var data = {};
      data["oid"] = oid;
      this.$api.getUser.orderMoneyList(data).then((res) => {
        if (res.data.status == 1 && res.data.code == 200) {
          this.moneylist = res.data.result;
          console.log(res);
        } else {
          this.$fnc.alertError(res.data.result);
        }
      });
    },
    getDetails(id) {
      var data = {};
      data["id"] = id;
      this.$api.getUser.getOrderInfo(data).then((res) => {
        this.base = res.data.result.base;
        this.base.pay_time = this.$fnc.vuetime(this.base.pay_time);
        this.base.mail_time = this.$fnc.vuetime(this.base.mail_time);
        this.base.complete_time = this.$fnc.vuetime(this.base.complete_time);
        this.product_ar = res.data.result.product_ar;
        this.lifting = res.data.result.lifting;
        this.selectedOptions = [
          this.base.mail_province,
          this.base.mail_city,
          this.base.mail_area,
        ];
        if (this.base.mail_town) {
          this.selectedOptions.push(this.base.mail_town);
        }
        this.people = res.data.result.people;
        this.store = res.data.result.store;
        this.group_buy = res.data.result.group_buy;
        this.receiving_ar = res.data.result.receiving_ar || {};
        this.receiving_additions_ar =
          res.data.result.receiving_additions_ar || [];
        this.receiving_service_ar = res.data.result.receiving_service_ar;
        this.getmonsylist(this.base.oid);
      });
    },
    addUpdate() {
      var data = {};
      data["id"] = this.base.id;
      data["pay_time"] = this.$fnc.phptime(this.base.pay_time) || "";
      data["mail_time"] = this.$fnc.phptime(this.base.mail_time) || "";
      data["complete_time"] = this.$fnc.phptime(this.base.complete_time) || "";
      data["is_pay"] = this.base.is_pay;
      data["remark"] = this.base.remark;
      data["admin_remark"] = this.base.admin_remark;
      this.$api.getUser.updateOrderInfo(data).then((res) => {
        if (res.data.status == 1 && res.data.code == 200) {
          this.$fnc.alertSuccess({
            text: "提交成功",
            url: this.$router.back(-1),
          });
          this.visible = false;
        } else {
          this.$fnc.alertError(res.data.code_desc, res.data.result);
        }
      });
    },
    subForm() {
      var data = {};
      data["id"] = this.base.id;
      data["mail_name"] = this.base.mail_name;
      data["mail_tel"] = this.base.mail_tel;
      data["mail_province"] = this.base.mail_province;
      data["mail_city"] = this.base.mail_city;
      data["mail_area"] = this.base.mail_area;
      data["mail_town"] = this.base.mail_town;
      data["mail_address"] = this.base.mail_address;
      data["admin_remark"] = this.base.admin_remark;
      this.$api.getUser.getEditMail(data).then((res) => {
        if (res.data.status == 1 && res.data.code == 200) {
          this.$fnc.alertSuccess({ text: "修改成功" });
          this.visible = false;
        } else {
          this.$fnc.alertError(res.data.code_desc, res.data.result);
        }
      });
    },
  },

  beforeCreate() {
    this.loading = true; //数据未加载之前调用loading
  },
  created() {
    this.loading = false;
  },
  computed: {},
  watch: {},
  mounted() {
    this.getDetails(this.$route.query.id);
  },
};
</script>

<style lang="less" scoped>
.hover_a {
  color: #328ff0;
  text-decoration: underline;
}
.hover_a:hover {
  cursor: pointer;
  color: #328ff0;
  text-decoration: underline;
  // text-decoration: ;
}
.add_con_form {
  margin-bottom: 20px;
}
.detail_content {
  width: 100%;
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #f3f3f3;
  .detail_title {
    width: 120px;
    font-size: 14px;
    color: #626262;
    font-weight: bold;
    margin-right: 10px;
    margin-bottom: 15px;
  }
  .detail_box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    font-size: 14px;
    color: #626262;
    .detail_information_item {
      width: 100%;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      margin-bottom: 15px;
      .information_title {
        width: 120px;
      }
    }
    .detail_box_text {
    }
  }
}
</style>
